@charset 'utf-8';
@import "common/base";

header {
    @include wh($full,75px);
}

section {
    top: 75px;

    .section-banner {
        @include wh(r(703),r(259));
        margin: 0 auto;
        .banner-img {
            width: $full;
            img {
                width: $full;
            }
        }
        .price {
            @include wh(r(666),r(120));
            margin: 0 auto;
            p {
                font-size: r(56);
                line-height: r(120);
                color: #FF9344;
                span {
                    margin-right: r(20);
                }
            }

            .buy-btn {
                @include wh(r(111),r(59));
                border-radius: r(20);
                background: #FF9344;
                text-align: center;
                margin: r(30) 0 0 0;
                button {
                    background: transparent;
                    font-size: r(30);
                    line-height: r(59);
                    color: #FFFFFF;
                }
            }
        }
        
        .comment {
             @include wh(r(666),r(62));
             margin: 0 auto;
             p {
                font-size: r(30); 
                line-height: r(62);
                i {
                    color: #FF9344;
                    margin-right: r(10);
                }
                span {
                    color: #FF9344;
                }
             }
             
             a {
                 font-size: r(27);
                 line-height: r(62);
                 color: #8e8e8e;
             }
        }

        .appraise {
            @include wh(r(666),r(62));
            margin: r(15) auto 0;
            background: #FF9344;
            p {
                font-size: r(32);
                line-height: r(62);
                color: #FFFFFF;
                margin-left: r(10);
            }

            a {
                font-size: r(24);
                line-height: r(62);
                color: #FFFFFF;
                margin-right: r(7);
            }
        }

        .item-box {
            width: r(666);
            margin: r(10) auto;
            .item {
                @include wh($full,r(175));
                margin-bottom: r(15);
                .item-img {
                    @include wh(r(176),r(176));
                    margin-right: r(25);
                    position: relative;
                    a {
                        img {
                            width: $full;
                        }
                    }
                    &::after {
                        content: '万岁寿司';
                        display: block;
                        @include wh(r(175),r(37));
                        position: absolute;
                        top: r(92);
                        text-align: center;
                        font-size: r(22);
                        line-height: r(37);
                        background: rgba(177,176,175,0.5);
                    }
                }

                .item-info {
                    @include wh(r(290),r(176));
                    .name {
                        width: $full;
                        font-size: r(32);
                        line-height: r(35);
                    }

                    .star-box {
                        width: $full;
                        i {
                            font-size: r(33);
                            line-height: r(37);
                            color: #FF9344;
                            vertical-align: middle;
                        }
                        span {
                            font-size: r(24);
                            line-height: r(37);
                            color: #929292;
                        }
                    }

                    .distance {
                        font-size: r(23);
                        line-height: r(35);
                        color: #929292;
                    }

                    .checkdetail {
                        a {
                            font-size: r(19);
                            color: #FF9344;
                        }
                    }
                }

                .enter-btn {
                    @include wh(r(111),r(59));
                    border-radius: r(20);
                    background: #FF9344;
                    text-align: center;
                    margin-top: r(55);
                    button {
                        vertical-align: top;
                        width: $full;
                        font-size: r(30);
                        line-height: r(59);
                        color: #FFFFFF;
                        background: transparent;
                    }
                }
            }
        }
    }
}
